<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>Adminox - Responsive Web App Kit</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description">
    <meta content="Coderthemes" name="author">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- App favicon -->
    <link rel="shortcut icon" href="${ctx}/admin/${ctx}/admin/images/favicon.ico">
    <!-- DataTables -->
    <link href="${ctx}/admin/plugins/datatables/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css">
    <link href="${ctx}/admin/plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css">
    <!-- Responsive datatable examples -->
    <link href="${ctx}/admin/plugins/datatables/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css">
    <!-- App css -->
    <link href="${ctx}/admin/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="${ctx}/admin/css/icons.css" rel="stylesheet" type="text/css">
    <link href="${ctx}/admin/css/metismenu.min.css" rel="stylesheet" type="text/css">
    <link href="${ctx}/admin/css/style.css" rel="stylesheet" type="text/css">
    <script src="${ctx}/admin/js/modernizr.min.js"></script>
</head>
<body>
<!-- Begin page -->
<div id="wrapper">
    <#include "../common/header.ftl">
    <!-- Top Bar End -->
    <!-- ========== Left Sidebar Start ========== -->
    <#include "../common/menu.ftl">
    <!-- Left Sidebar End -->
    <!-- ============================================================== -->
    <!-- Start right Content here -->
    <!-- ============================================================== -->
    <div class="content-page">
        <!-- Start content -->
        <div class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        <div class="page-title-box">
                            <h4 class="page-title float-left">微信文本素材</h4>
                            <ol class="breadcrumb float-right">
                                <li class="breadcrumb-item"><a href="#">Adminox</a></li>
                                <li class="breadcrumb-item"><a href="#">Tables</a></li>
                                <li class="breadcrumb-item active">Datatable</li>
                            </ol>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
                <!-- end row -->
                <div class="row">
                    <div class="col-12">
                        <div class="card-box table-responsive">
                            <h4 class="text-uppercase font-18">微信文本素材</h4>
                            <div class="border m-b-30"></div>
	                        <div class="row">
                                <div class="col-12">
                                    <div class="m-b-30">
	                                    <button type="button" onclick="add_template()" class="btn btn-primary waves-effect w-md waves-light"><i class="fa fa-plus"></i>  新增</button>
                                    </div>
	                             </duv>
                            </div>
                            <table id="datatable-buttons" class="table table-striped table-bordered" cellspacing="0"
                                   width="100%">
                                <thead>
                                <tr>
                                    <th>文本名称</th>
                                    <th>文本内容</th>
                                    <th>创建时间</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <#list textTemplateList as template >
                                <tr>
	                                <td>${template.templateName}</td>
	                                <td>${template.templateContent}</td>
	                                <td>${template.createTime?string('yyyy.MM.dd')}</td>
	                                <td>操作</td>
                                </tr>
                                </#list>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <!-- end row -->
            </div>
            <!-- container -->
        </div>
        <!-- content -->
    <#include "../common/footer.ftl">
    </div>

    <!--新增文本素材-->
    <div id="add-template" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
         aria-hidden="true" style="display: none;">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">新增文本素材</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label for="template-name" class="control-label">文本名称</label>
                                <input type="text" class="form-control" id="template-name">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                                <label for="template-content" class="control-label">文本内容</label>
                                <textarea class="form-control" id="template-content"></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary waves-effect" data-dismiss="modal">关闭</button>
                    <button type="button" id="model-save" class="btn btn-info waves-effect waves-light">保存</button>
                </div>
            </div>
        </div>
    </div>
    <!-- ============================================================== -->
    <!-- End Right content here -->
    <!-- ============================================================== -->
</div>
<!-- END wrapper -->
<!-- jQuery  -->
<script src="${ctx}/admin/js/jquery.min.js"></script>
<script src="${ctx}/admin/js/tether.min.js"></script>
<!-- Tether for Bootstrap -->
<script src="${ctx}/admin/js/bootstrap.min.js"></script>
<script src="${ctx}/admin/js/metisMenu.min.js"></script>
<script src="${ctx}/admin/js/waves.js"></script>
<script src="${ctx}/admin/js/jquery.slimscroll.js"></script>
<!-- Required datatable js -->
<script src="${ctx}/admin/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/dataTables.bootstrap4.min.js"></script>
<!-- Buttons examples -->
<script src="${ctx}/admin/plugins/datatables/dataTables.buttons.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/buttons.bootstrap4.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/jszip.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/pdfmake.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/vfs_fonts.js"></script>
<script src="${ctx}/admin/plugins/datatables/buttons.html5.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/buttons.print.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/buttons.colVis.min.js"></script>
<!-- Responsive examples -->
<script src="${ctx}/admin/plugins/datatables/dataTables.responsive.min.js"></script>
<script src="${ctx}/admin/plugins/datatables/responsive.bootstrap4.min.js"></script>
<!-- App js -->
<script src="${ctx}/admin/js/jquery.core.js"></script>
<script src="${ctx}/admin/js/jquery.app.js"></script>
<script type="text/javascript">
	function add_template() {
		$("#add-template").modal('show');
	}
	$(function () {
		$("#model-save").on('click',function(){
			var templateName = $("#template-name").val();
			var templateContent = $("#template-content").val();
			$.ajax({
				url:'${ctx}/template/text/add',
				data:{'templateName':templateName,'templateContent':templateContent},
				type:'POST',
				success:function (res) {
					alert(res);
				}
			})
		})
	})
</script>
</body>
</html>